---
title: Eleventyからの移行
description: EleventyプロジェクトをAstroに移行するためのガイド
sidebar:
  label: Eleventy
type: migration
stub: true
framework: Eleventy
i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import { Steps, LinkCard, CardGrid } from '@astrojs/starlight/components';

[Eleventy](https://11ty.dev)は複数のテンプレート言語で動作するオープンソースの静的サイトジェネレーターです。

## EleventyとAstroの類似点

- どちらもモダンなJavaScriptベース(Jamstack)のサイトビルダーです。
- 両者とも[ヘッドレスCMSやAPI、Markdownファイルをデータソース](/ja/guides/data-fetching/)として使用できます。既存コンテンツはそのまま利用可能です。

## EleventyとAstroの主な相違点

- Eleventyは多彩なテンプレート言語をサポートしますが、Astroは[Astroコンポーネント](/ja/basics/astro-components/)を中心に、React・Svelte・Vue・Solidなどのフレームワークコンポーネントをオプションで組み込みます。
- Astroは[サイトメタデータも含むすべてのファイルを`src/`ディレクトリ](/ja/basics/project-structure/#src)に置き、[`src/pages/`](/ja/basics/astro-pages/)でファイルベースルーティングを行います。
- 静的アセットは[`public/`フォルダ](/ja/basics/project-structure/#public)に配置し、ビルド時に変換されません。
- EleventyではCSSやJavaScriptのバンドルを手動設定しますが、[Astroは標準でバンドリングを自動処理](/ja/concepts/why-astro/#簡単に使える)します。

## EleventyサイトをAstroに変換する

EleventyブログをAstroへ移行する場合、まず公式ブログテーマスターターを使うか、[テーマショーケース](https://astro.build/themes/)でコミュニティ製ブログテーマを探してください。

`create astro`コマンドに`--template`を渡すと、公式スターターで新しいAstroプロジェクトを作成できます。また、[GitHub上の既存Astroリポジトリから新規プロジェクトを開始](/ja/install-and-setup/)することも可能です。

<PackageManagerTabs>
    <Fragment slot="npm">
    ```shell
    npm create astro@latest -- --template blog
    ```
    </Fragment>
    <Fragment slot="pnpm">
    ```shell
    pnpm create astro@latest --template blog
    ```
    </Fragment>
    <Fragment slot="yarn">
    ```shell
    yarn create astro --template blog
    ```
    </Fragment>
</PackageManagerTabs>

既存Markdown(またはMDX※オプション)ファイルを[Markdown/MDXページとして追加](/ja/guides/markdown-content/)し、移行を開始します。

Eleventyでは複数テンプレート言語で構築できましたが、Astroでは主にAstroコンポーネントをテンプレートとして使用します。UI要素・レイアウト・ページを[Astroのコンポーネント構文](/ja/basics/astro-components/)で記述する方法を確認してください。

ポートフォリオやドキュメントサイトなど他タイプのサイトを移行する場合は、[astro.new](https://astro.new)にある他のスターターテンプレートも参照すると便利です。各テンプレートのGitHubリポジトリやIDX、StackBlitz、CodeSandbox、Gitpodで開くリンクが用意されています。

## コミュニティリソース

<CardGrid>
  <LinkCard title="This Site Is Now Built with Astro" href="https://aqandrew.com/blog/now-built-with-astro/" description="EleventyからAstroへ移行した理由。" />
  <LinkCard title="Website Rewrite: 2025" href="https://www.welchcanavan.com/posts/site-rewrite-2025/" />
</CardGrid>
